
window.addEventListener('DOMContentLoaded', function () {

    //  Mobile menu - Burger
    const mobileMenu = document.querySelector('.header-nav__mobile');
    const burgerBtn = document.querySelector('.burger');

    burgerBtn.addEventListener('click', function () {
        mobileMenu.classList.toggle('active');
        burgerBtn.classList.toggle('active');
    })
    
    //  tooltips
   let tooltipElem;
    document.onmouseover = function (e) {
        let target = e.target;
        let tooltipHtml = target.dataset.tooltip;
        if (!tooltipHtml) return;
        
        tooltipElem = document.createElement('div');
        tooltipElem.classList.add('tooltip');
        tooltipElem.innerHTML = tooltipHtml;
        document.body.append(tooltipElem);
        
        let coords = target.getBoundingClientRect();
        let left = coords.left + (target.offsetWidth - tooltipElem.clientWidth) / 2;
        if (left < 0) left = 5;
        
        let top = coords.top - tooltipElem.clientHeight - 5;
        if (top < 0) top = coords.top + target.offsetHeight + 5;
    
        tooltipElem.style.left = left + 'px';
        tooltipElem.style.top = top + 'px';
    }
    document.onmouseout = function (e) {
        if (tooltipElem) {
            tooltipElem.remove()
            tooltipElem = null
        }
    }
//     accordion
    const titles = document.querySelectorAll('.accordion__title');
    const contents = document.querySelectorAll('.accordion__content');
    
    titles.forEach(item => item.addEventListener('click', () => {
        const activeContent = document.querySelector('#' + item.dataset.tab);
        
        if (activeContent.classList.contains('active')) {
            activeContent.classList.remove('active');
            item.classList.remove('active');
            activeContent.style.maxHeight = 0;
        } else {
            contents.forEach( element => {
                element.classList.remove('active');
                element.style.maxHeight = 0;
            });
            
            titles.forEach(element => element.classList.remove('active'));
            
            item.classList.add('active');
            activeContent.classList.add('active');
            activeContent.style.maxHeight = activeContent.scrollHeight + 'px';
        }
    }))
//     делаем активной(открытой) одну вкладку
    document.querySelector('[data-tab="tab-1"]').classList.add('active');
    document.querySelector('#tab-1').classList.add('active');
    document.querySelector('#tab-1').style.maxHeight = document.querySelector('#tab-1').scrollHeight + 'px';
});
// Choices Pass single element
const element = document.querySelector('select');
const choices = new Choices(element, {
    searchEnabled: false
});





